|
Por
Milko A. García Torres
Enmascaramiento
de imágenes:
"Las máscaras
se crean agrupando dos objetos en un grupo de máscara
El objeto superior (la máscara) se utiliza para crear un efecto
de recorte sobre el objeto inferior. Puede utilizar tanto una imagen como
un objeto con trazados como objeto superior de la máscara"
(del manual oficial de Macromedia).
| En este caso,
como la máscara era negra, la figura tomó toda la escala
de grises del color que tenía debajo |
 |
De ahí
podemos concluir que, cuando la máscara se halla por debajo
del objeto, este adoptará la gama de colores que le defina
la máscara.
En la foto de la derecha, la máscara era color bordó. |
 |
Gifts
animados:
"Una animación
GIF está formada por una serie de imágenes fijas que aparecen
de forma consecutiva a gran velocidad, lo que permite percibirlas como
una imagen en movimiento. Al crear una animación en Fireworks,
cada imagen se sitúa en un fotograma distinto. A continuación,
todas las imágenes de una animación se exportan en un archivo
GIF animado. En Fireworks es posible abrir y editar animaciones GIF existentes
o crear otras nuevas". (Manual oficial de Macromedia)
Esto implica que para
crear un GIF animado debemos tener, en primera instancia, esa "serie
de imágenes fijas" que lo conformarán, ya sean diseñadas
por nosotros o provistas por otros medios.
Primeramente vamos
a ver un ejemplo con una imagen importada. En este caso, importamos un
gif animado.
|
Al
importar el gif, nos aparecerá la siguiente ventana. En ella
se nos pregunta si queremos que se agreguen los Fotogramas (frames)
necesarios para conservar la animación. Es decir, cada frame
contendrá una de las imágenes de la animación.
Obviamente, en este caso, le responderemos OK.
|
|
Bien, aquí
tenemos ya el gif en el lienzo, y al lado se ve la ventana de frames.
Acuérdense que cada frame es una imagen.
Si viésemos
todos los frames al mismo tiempo se vería algo como lo de
la imagen inferior.
|
Bien,
pero, para qué importamos un gif animado a Fireworks, si pensamos
volver a exportarlo como gif animado? Pues para optimizarlo. Las opciones
son pocas, pero las hay. Por ahora, en este nivel de aprendizaje,
conviene que tengamos en claro que, una vez definido como Gif Animado
(tal como se marca en la imagen), el otro parámetro de optimización
que nos queda es la cantidad de colores. |
Finalmente,
para probar el producto final, hacemos clic en el botón Play,
abajo a la izquierda, en la ventana del documento .
Y allí veremos la animación en curso. Y ahora ... sólo
basta pedirle tres deseos ... |
|
En un segundo ejemplo
vamos a ver cómo crear un gif animado desde cero, y lo haremos
elaborando algo muy utilizado en las páginas web: un banner publicitario,
pero uno discreto, de 240x50. Recordemos, que los gifs animados son secuencias
de imágenes, por tanto, para empezar desde cero, debemos crear
esas imágenes.
Creamos
entonces la primera imagen: la idea de la animación es que
la línea punteada 1 corra hacia la derecha, y la 2 hacia la
izquierda, mientras que el texto pasa de izquierda a derecha. Fijémonos
que TODO está en un sólo frame, así que, con
la herramienta "Duplicar fotograma", que está marcada
como 3, creamos un fotograma nuevo. |
En
el segundo fotograma pegamos exactamente los mismos elementos, en
la misma posición (con Copiar y Pegar), y luego movemos cada
uno de ellos al lugar que le correspondería en el segundo cuadro
de animación. Y así sucesivamente hasta completar toda
la animación. |
Finalmente
tenemos todos los fotogramas correspondientes a cada instancia de
la animación, y hemos ido moviendo, fotograma por fotograma,
cada uno de los elementos.
Nótese que en los últimos fotogramas duplicamos el texto
y lo hicimos aparecer por la izquierda para crear la ilusión
que aparecía por ese lado a medida que desaparecía por
la derecha. El paso siguiente es, en la herramienta marcada en rojo,
poner cuántas veces se repetirá la animación,
si no se repetirá nunca, o como está configurado en
este caso: "forever", o sea, la repetición o "loop",
será continuo. |
A
continuación se optimiza como gif animado del modo habitual,se
exporta, y aquí tenemos el resultado final:
|
Con respecto a los
efectos que podemos aplicar a los GIF's animados, sólo resta
señalar dos cosas:
1- Los efectos referidos a sombras y texturas, son los mismos aplicables
a cualquier imagen.
2- Los que están referidos al movimientos de las imágenes
habrá que determinarlos por medio de una conveniente distribución
en los distintos frames.
Con respecto a la
optimización y exportación de un GIF animado:
1- Para la optimización de las imágenes que componen la
animación, deben tenerse seleccionados todos los frames.
2- La exportación es exactamente igual que en un GIF no animado,
sólo que en el mismo proceso de optimización hay que especificar
que la exportación será como GIF animado.
Creación
y organización de capas:
"Las capas dividen los documentos de Fireworks en planos discretos,
como los elementos de una ilustración que se dibujan en distintas
hojas superpuestas transparentes. Cada
objeto de un documento reside en una capa. Puede crear todas las capas
antes de comenzar a dibujar o ir añadiéndolas cuando sea
necesario. También puede reorganizar el orden de apilamiento de
las capas o de los objetos de una sola capa".(Manual
Oficial de Macromedia)
|
La ventana que
nos permite trabajar con las capas (layers), la podemos visualizar
desde el menú Ventana(Window)>Capas(Layers).
Por defecto, el lienzo nos aparece con dos capas: la capa web, en
donde posteriormente ubicaremos los objetos de zona interactiva;
y la capa 1.
Los objetos que Ud. vaya dibujando, aparecerán por defecto
en la capa 1, pero Ud. tiene la posibilidad de agregar más
capas mediante el botón Agregar capas.
El hecho de trabajar en capas le dará la posibilidad de trabajar
con diversos efectos.
|
 |
En
un documento recién abierto, inserte una foto. Esta aparecerá
en una capa independiente de la capa 1. Posiciónese en la
capa 1 haciendo clic sobre ella y dibuje una figura geométrica
cualquiera (recuerde que estamos probando), y luego colóquela
sobre la figura
.
|
En
el menú desplegable que se muestra en la imagen, se pueden
encontrar los efectos disponibles para trabajar en capas, pero no
olvidemos que esto dependerá del color de la figura que usemos
en la capa que actuará de máscara.
Si hacemos clic en el ojo correspondiente a cada imagen, veremos que
esta se o culta o se muestra, según se oculte o aparezca el
ojo. Y la presencia del lápiz junto a alguna imagen, nos indicará
que se está trabajando o que se tiene seleccionada esa imagen. |
 |
Historial
del documento:
"El panel Historial
permite ver, cambiar y repetir el historial del documento. En este panel
se enumeran las acciones más recientes que se han realizado en
Fireworks, conforme al número especificado en Pasos de deshacer".
(Manual de Macromedia)
O sea que con el historial
podemos:
1- Deshacer y rehacer comandos frecuentes.
2- Seleccionar un número determinado de comandos realizados para
repetirlos.
3- Seleccionar y guardar un grupo de comandos recientemente realizados,
para guardarlo como un solo comando.
Abra
la ventana del historial con el menú Ventana(Window)>
Historial(History). Ahí podrá ver las acciones
que ha ido realizando, desde la primera a la última, de arriba
hacia abajo.
Si selecciona una de las acciones y luego presiona el botón
Volver a reproducir (Replay), obviamente repetirá esa acción. |
 |
| Si
selecciona una o más acciones y luego presiona el botón
Guardar como comando, aparecerá una ventana en donde
le pedirá el nombre para el nuevo comando. Posteriormente,
cuando vuelva a necesitar esa acción o conjunto de acciones,
las encontrará agrupadas en un solo comando dentro del menú
Comando. |
 |
Búsqueda
y reemplazo:
Nos
falta hacer referencia ahora a la ventana de búsqueda y reemplazo,
similar en tareas a las que encontramos en los procesadores de texto.
La ventaja consiste en que podemos hacerlo con otros elementos, además
de texto:
"Utilice Buscar y reemplazar para buscar y reemplazar elementos,
como texto, valores URL, fuentes y color, en un documento. Con Buscar
y reemplazar se puede buscar en el documento actual o en varios archivos
a la vez. Durante el uso de Buscar y reemplazar, Fireworks puede efectuar
un seguimiento y guardar un registro de cambios en el panel Historial
del proyecto. Buscar y reemplazar sólo funciona con archivos
PNG de Fireworks o con archivos que
contienen objetos vectoriales, como archivos FreeHand, CorelDRAW e
Illustrator". (Manual de Macromedia)
La ventana de Búsqueda y reemplazo aparece desde el menú
Ventana(Window)>Buscar y reemplazar(Find and replace). |
|